<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <!-- import CSS -->
    <link rel="stylesheet" href="https://cdn.staticfile.org/element-ui/2.15.9/theme-chalk/index.css">
</head>
<style>
    * { margin:0;
        padding:0;
    }
    body{
        font-size:14px;
        color:#000;
        font-family:Arial, 微软雅黑, 宋体;
    }
    ul{
        list-style:none;
    }
    img{
        display:block;
        border:none;
    }
    a{
        color:#000;
        text-decoration:none;
    }
    .box{
        width:100%;
        height:1362px;
        background:url(../imgs/images/1.png) no-repeat top center;
        padding-top:40px;
    }
    .inner_c{
        width:1200px;
        margin:0 auto;
    }
    .inner_c li{
        width:240px;
        height:345px;
        border:1px solid #dfe9f7;
        padding:20px 20px 10px;
        display:inline-block;
        position:relative;
        margin-right:24px;
        border-radius: 10px;
        background:#fff;
        float:left;
        margin-bottom:40px;
    }
    .inner_c li:nth-child(4n){
        margin-right:0px;
    }
    .inner_c li img{
        width:240px;
        height:240px;
        border-radius: 10px;
    }
    .fa{
        width:60px;
        height:25px;
        background-color:rgb(0,0,0);
        box-shadow: rgb(255, 255, 255) 0px 0px 3px;
        border-radius:15px;
        position: absolute;
        top:30px;
        left:30px;
        color:#fff;
        text-align:center;
        line-height:25px;
    }
    .inner_c li span{
        font-size:19px;
        color:#666;
        margin-top:30px;
        display:block;
    }
    .di{
        width:240px;
        height:auto;
        margin-top:25px;
    }
    .di_left{
        width:100px;
        height:auto;
        float:left;
    }
    .di_left p{
        font-size:14px;
        float:left;
        color:#f5c507;
        margin-top:4px;
    }
    .di_left h2{
        color:#f5c507;
    }
    .di_right{
        font-size:16px;
        float:right;
        color:#aaaaaa;
    }




    .page{
        width:238px;
        height:33px;
        margin:0 auto;

    }
    .shouye{
        width:33px;
        height:33px;
        border-radius:5px;
        float:left;
        font-size:14px;
        text-align:center;
        line-height:33px;
        color:#a8a8a8;
        margin-right:6px;
        background:#f4f4f5;
    }

    .yema{
        width:160px;
        height:33px;
        float:left;
    }
    .yema a{
        width:33px;
        height:33px;
        display:block;
        border-radius:5px;
        float:left;
        font-size:14px;
        color:#9d9d9d;
        text-align:center;
        line-height:30px;
        margin-right:6px;
        background:#f4f4f5;
    }
    .yema a:nth-child(4n){
        margin-right:0px;
    }
    .weiye{
        width:33px;
        height:33px;
        border-radius:5px;
        float:right;
        font-size:14px;
        text-align:center;
        line-height:33px;
        color:#a8a8a8;
        margin-right:6px;
        background:#f4f4f5;
    }

    .yema a:hover{
        width:33px;
        height:33px;
        display:block;
        border-radius:5px;
        float:left;
        font-size:14px;
        color:#409eff;
        text-align:center;
        line-height:33px;
        margin-right:6px;
    }
    #ho{
        width:33px;
        height:33px;
        display:block;
        border-radius:5px;
        background:#409eff;
        float:left;
        font-size:14px;
        color:#fff;
        text-align:center;
        line-height:33px;
        margin-right:6px;
    }
    a {
        text-decoration: none;
        color: #666666;
    }
    .footer {
        margin: 0 auto;
        height: 415px;
        background-color: #f5f5f5;
        padding-top: 30px;
    }
</style>
<body>
<div style="width: 1200px;margin: 0 auto;background-color: #fff;
font: 25px/1.5 -apple-system,BlinkMacSystemFont,PingFang SC,Microsoft yahei,arial,PingFangSC-Regular,sans-serif;">
    <a href="/"><img src="../imgs/logo.png" style="width: 50px;margin-left: 50px;vertical-align: middle" alt=""></a>
    <a href="index.html" style="margin-left: 50px">首页</a>
    <el-divider direction="vertical"></el-divider>
    <a href="fashourili.html" style="margin-left: 30px">发售日历</a>
    <el-divider direction="vertical"></el-divider>
    <a href="aboutus.html" style="margin-left: 30px">关于我们</a>
    <el-divider direction="vertical"></el-divider>
    <a href="helloeui.html" style="margin-left: 30px">公告</a>
    <el-divider direction="vertical"></el-divider>
    <a href="personal.html" style="margin-left: 30px">个人中心</a>
    <el-divider direction="vertical"></el-divider>
    <span style="margin-left: 200px;"><a href="/login.html">登录</a>
  |
    <a href="/reg.html">注册</a></span>
</div>
<div id="app">
    <div class="box">
        <div class="inner_c">
            <ul>
                <li>
                    <img src="../imgs/images/2.jpg" alt=""/>
                    <div class="fa">已售罄</div>
                    <span>世界难忘北京</span>
                    <div class="di">
                        <div class="di_left"><p>￥</p><h2>88.00</h2></div>
                        <div class="di_right">发行量：</div>
                    </div>
                </li>
                <li>
                    <img src="../imgs/images/3.jpg" alt=""/>
                    <div class="fa">已售罄</div>
                    <span>北京，今晚</span>
                    <div class="di">
                        <div class="di_left"><p>￥</p><h2>26.66</h2></div>
                        <div class="di_right">发行量：</div>
                    </div>
                </li>

                <li>
                    <img src="../imgs/images/4.jpg" alt=""/>
                    <div class="fa">已售罄</div>
                    <span>开幕式为中国赢得尊敬</span>
                    <div class="di">
                        <div class="di_left"><p>￥</p><h2>65.00</h2></div>
                        <div class="di_right">发行量：</div>
                    </div>
                </li>

                <li>
                    <img src="../imgs/images/5.jpg" alt=""/>
                    <div class="fa">已售罄</div>
                    <span>奶龙·玉树临风</span>
                    <div class="di">
                        <div class="di_left"><p>￥</p><h2>28.00</h2></div>
                        <div class="di_right">发行量：</div>
                    </div>
                </li>



                <li>
                    <img src="../imgs/images/6.jpg" alt=""/>
                    <div class="fa">已售罄</div>
                    <span>牛魔</span>
                    <div class="di">
                        <div class="di_left"><p>￥</p><h2>78.00</h2></div>
                        <div class="di_right">发行量：</div>
                    </div>
                </li>
                <li>
                    <img src="../imgs/images/7.jpg" alt=""/>
                    <div class="fa">已售罄</div>
                    <span>土地魔</span>
                    <div class="di">
                        <div class="di_left"><p>￥</p><h2>36.80</h2></div>
                        <div class="di_right">发行量：</div>
                    </div>
                </li>

                <li>
                    <img src="../imgs/images/8.jpg" alt=""/>
                    <div class="fa">已售罄</div>
                    <span>Mini EV 红色</span>
                    <div class="di">
                        <div class="di_left"><p>￥</p><h2>69.00</h2></div>
                        <div class="di_right">发行量：</div>
                    </div>
                </li>

                <li>
                    <img src="../imgs/images/9.jpg" alt=""/>
                    <div class="fa">已售罄</div>
                    <span>大美大艺·荣曜同禄</span>
                    <div class="di">
                        <div class="di_left"><p>￥</p><h2>22.50</h2></div>
                        <div class="di_right">发行量：</div>
                    </div>
                </li>



                <li>
                    <img src="../imgs/images/10.jpg" alt=""/>
                    <div class="fa">已售罄</div>
                    <span>航天尊</span>
                    <div class="di">
                        <div class="di_left"><p>￥</p><h2>22.00</h2></div>
                        <div class="di_right">发行量：</div>
                    </div>
                </li>
                <li>
                    <img src="../imgs/images/11.jpg" alt=""/>
                    <div class="fa">已售罄</div>
                    <span>建国金尊</span>
                    <div class="di">
                        <div class="di_left"><p>￥</p><h2>47.88</h2></div>
                        <div class="di_right">发行量：</div>
                    </div>
                </li>

                <li>
                    <img src="../imgs/images/12.jpg" alt=""/>
                    <div class="fa">已售罄</div>
                    <span>釉里红“岁寒三友”图梅瓶</span>
                    <div class="di">
                        <div class="di_left"><p>￥</p><h2>22.00</h2></div>
                        <div class="di_right">发行量：</div>
                    </div>
                </li>

                <li>
                    <img src="../imgs/images/13.jpg" alt=""/>
                    <div class="fa">已售罄</div>
                    <span>奶龙·怎么肥事</span>
                    <div class="di">
                        <div class="di_left"><p>￥</p><h2>24.00</h2></div>
                        <div class="di_right">发行量：</div>
                    </div>
                </li>
            </ul>



        </div>

        <div class="page">
            <a href="#"><div class="shouye"><</div></a>
            <div class="yema">
                <ul>
                    <a href="#" id="ho">1</a>
                    <a href="#">2</a>
                    <a href="#">3</a>
                    <a href="#">4</a>
                </ul>
            </div>
            <a href="#"> <div class="weiye">></div></a>


        </div>
</div>
</div>

</body>
<!-- import Vue before Element -->
<script src="https://cdn.staticfile.org/vue/2.6.14/vue.min.js"></script>
<!-- import JavaScript -->
<script src="https://cdn.staticfile.org/element-ui/2.15.9/index.min.js"></script>
<script>
   let v = new Vue({
        el: '#app',
        data: function() {
            return {

            }
        },
       methods:{

       }
    })
</script>
</html>